CognitoとALBを組み合わせて日本語のログイン画面を実装してみた

CognitoとALBを組み合わせて日本語のログイン画面を実装してみた

Clock Icon2025.01.06

はじめに

2024年11月、Cognitoにマネージドログイン機能が追加されました。これによりログインメニューのブランディングのカスタマイズが可能となり、従来のホストされたUI(クラシックスタイル)では実装に手間が掛かっていたようなことも簡単に実現できるようになりました。詳しくは以下の記事も参照してください。

https://dev.classmethod.jp/articles/amazon-cognito-managed-login/

上記の記事でも紹介されていますが、マネージドログイン機能では日本語でログイン画面を表示することも可能になりました。
今回は、Cognitoのマネージドログイン機能とALBを組み合わせて、日本語のログイン画面をサクッと実装する方法をご紹介します。

ユーザープールの作成

まずは、Cognitoのユーザープールを作成します。Cognitoのコンソールにログインし、ユーザープールを作成します。

Cognitoのユーザープール

(Cognitoのマネージメントコンソールのユーザープール作成画面、以前に比べてシンプルになっていますね・・・)

ALBのリスナールールの設定

HTTPSのリスナールールのアクションで、認証をCognitoに設定します。その後、 [追加のリクエストパラメーター] - [IDプロバイダーのパラメータ] のキーに lang を設定し、値に ja を設定します。

ALBのリスナールール

これにより、ALBに紐付けたドメインにアクセスすると、日本語のログイン画面が表示されます。

日本語化されたログイン画面

おわりに

これまで、Cognitoを用いて日本語のログイン画面を実装する場合、UIを実装してCognitoのAPIを使ったり、Amplifyを使って実装したりする必要がありましたが、マネージドログイン機能を使うことで、簡単に日本語のログイン画面を実装することができるようになりました。

選択肢が増えたことで、より使いやすいサービスになったと感じます。ぜひ、お試しください。

Share this article

facebook logohatena logotwitter logo

© Classmethod, Inc. All rights reserved.